declare let eManager,dbh,DBManager,proto_cs,JsonHttp;
const { ccclass, property } = cc._decorator;

import BaseView from "../component/BaseView";
const SCRIPT_NAME_LIST = [
    "StepOne",
    "StepTwo",
    "StepThree",
    "StepFour",
    "StepFive",
    "StepSix",
    "StepSeven",
    "StepEight",
    "StepNine",
]
@ccclass
export default class HuaZhuangMainView extends BaseView {
    //下一个步骤
    @property(cc.Node)
    nodeNextStep: cc.Node = null;
    //下一小阶段
    @property(cc.Node)
    nodeNextPoint: cc.Node = null;
    //妆容得分完成
    @property(cc.Node)
    nodeScoreDone: cc.Node = null;
    //步骤数
    @property(cc.Label)
    lblStep: cc.Label = null;
    //步骤名字
    @property(cc.Label)
    lblStepName: cc.Label = null;
    @property(cc.Node)
    stepList: cc.Node[] = [];

    @property(cc.Node)
    showNode: cc.Node = null;

    @property(cc.Node)
    hideNode: cc.Node = null;

    @property(cc.Node)
    bgPhoto: cc.Node = null;

    @property(cc.Node)
    btnPhoto: cc.Node = null;

    @property(cc.Animation)
    rootAni: cc.Animation = null;

    @property(cc.Animation)
    photoAni: cc.Animation = null;

    //化妆得分
    @property(cc.Node)
    scoreNode: cc.Node = null;
    //化妆render
    @property(cc.Node)
    scoreList:cc.Node[] = [];

    @property(cc.Node)
    selectNode: cc.Node = null;

    //拍照完成 匹配度Ani
    @property(cc.Animation)
    photoDoneAni:cc.Animation = null;
    //匹配度
    @property(cc.Label)
    lblMateNum: cc.Label = null;

    _curStep = 1;//步骤数
    _curPro = 1;//小进度
    _doneStep = 0;//完成了第几步
    _listData = [];
    onLoad() {
        //@ts-ignore
        this.photoAni.on("finished",this.photoFinish,this);
        this.nodeNextStep.active = false;
        this.nodeNextPoint.active = false;
        this.addEventListener();
        this.updateStepShow();
    };

    addEventListener() {
        eManager.on("DONE_STEP", this.doneStep, this)
        eManager.on("DONE_POINT", this.donePoint, this)
        eManager.on("SET_VIBRATE", this.setVibrate, this)
        eManager.on("REFRESH_STEP_NAME", this.refreshStepName, this)
        eManager.on("HZ_SHOW_SELECT_LIST", this.showSelectList, this)
        eManager.on("HZ_REFRESH_ICON_TIPS", this.showIconTips, this)
        eManager.on("HZ_MAKE_DOT", this.sendMakeDot, this)
    };

    updateStepShow() {
        for (let index = 0; index < this.stepList.length; index++) {
            this.stepList[index].active = this._curStep == index + 1;
        }
        this.updatePointShow();
        this.lblStep.string = "STEP " + this._curStep;
    };


    updatePointShow() {
        let step = this.stepList[this._curStep - 1];
        if (!step)
            return;
        let name = SCRIPT_NAME_LIST[this._curStep - 1];
        let sc_node = step.getComponent(name);
        if(sc_node){
            sc_node.updatePoint(this._curPro);
        }
    };

    refreshStepName(name:string){
        if(name && name.length > 0){
            this.lblStepName.node.parent.active = true;
            this.lblStepName.string = name;
        }else{
            this.lblStepName.node.parent.active = false;
        }
    };

    showSelectList(data:any){
        if(!data)
            return;
        this.selectNode.active = true;
        this._listData = [];
        for (let index = 0; index < 4; index++) {
            this._listData.push(data);
        }
    };

    onItemRender(item: any, index: number){
        if(!this._listData)
            return;
        item.listItem.showData(this._listData[index],index);
    };

    //完成步骤了
    doneStep(param: any) {
        cc.log("完成了第" + param + "步骤");
        this._doneStep = param;
        this.selectNode.active = false;
        //妆容得分
        if(param >= 3){
            this.nodeScoreDone.active = true;
        }else{
            this.nodeNextStep.active = true;
        }
        if(this.stepList[param-1]){
            this.stepList[param-1].active = false;
        }
    };

    //完成步骤的节点
    donePoint(param: any) {
        if ((this._curStep == 8 && this._curPro == 1) ||
            (this._curStep == 9 && this._curPro == 1)) {//第八九步换发型不播放完成  
        } else {
        }
        cc.log("完成了第" + param + "节点");
        this.nodeNextPoint.active = true;
    };
    //展示提示图片
    showIconTips(name){

    };

    showGetScore(param:number){
        for (let index = 0; index < this.scoreList.length; index++) {
            const node = this.scoreList[index];
            if (index == 0) {
                node.active = true;
            } else {
                if (param == 5 || param == 7 || param == 8 || param == 9) {
                    node.active = true;
                } else {
                    node.active = false;
                }
            }
            if(node.active){
                let render = node.getComponent("ScoreRender");
                if (render) {
                    let data = this.getScoreData(param, index);
                    render.showData(data);
                }
            }
        }
    };  

    getScoreData(step:number,index:number){
        let data: any = {
            name: "",
            icon: ""
        }
        if (step == 3) {
            data.name = "腮红"
            data.icon = "s_icon_saihong"
        } else if (step == 4) {
            data.name = "美瞳"
            data.icon = "s_icon_meitong"
        } else if (step == 6) {
            data.name = "睫毛"
            data.icon = "s_icon_jiemao"
        } else if (step == 5) {
            if (index == 0) {
                data.name = "眼影"
                data.icon = "s_icon_yanying"
            } else {
                data.name = "眼线"
                data.icon = "s_icon_yanxian"
            }
        }
        else if (step == 7) {
            if (index == 0) {
                data.name = "眉毛"
                data.icon = "s_icon_meimao"
            } else {
                data.name = "口红"
                data.icon = "s_icon_kouhong"
            }
        } else if (step == 8) {
            if (index == 0) {
                data.name = "发型"
                data.icon = "s_icon_faxing"
            } else {
                data.name = "衣服"
                data.icon = "s_icon_yifu"
            }
        } else if (step == 9) {
            if (index == 0) {
                data.name = "耳环"
                data.icon = "s_icon_ershi"
            } else {
                data.name = "项链"
                data.icon = "s_icon_xiangliang"
            }
        }
        return data;
    };

    //下一步骤
    onClickNextStep(event,index) {
        let _index = parseInt(index);
        if(_index == 2){
            this.scoreNode.active = false;
        }else{
            this.nodeNextStep.active = false;
        }
        if (this._curStep >= this.stepList.length) {
            // this.rootAni.play("end_pai");
            this.bgPhoto.active = true;
            this.btnPhoto.active = true;
            this.lblStep.string = "ShowTime";
            this.lblStepName.string = "美丽时刻";
            return;
        }
        this._curStep++;
        this._curPro = 1;
        this.updateStepShow();
    };

    //下一小阶段
    onClickNextPoint() {
        this.nodeNextPoint.active = false;
        this._curPro++;
        this.updatePointShow();
    };

    onClickScoreDone(){
        if(this._doneStep <= 0){
            return;
        }
        this.nodeScoreDone.active = false;
        this.scoreNode.active = true;
        let ani = this.scoreNode.getComponent(cc.Animation);
        if(ani){
            ani.play();
        }
        this.showGetScore(this._doneStep);
    };
    //拍照
    onClickPhoto(){
        this.photoAni.node.active = true;
        this.photoAni.play();
        this.btnPhoto.active = false;
    };
    //重置
    onClickClose() {
        // Utils.audioManager.playDefaultBGM();
        // UIHelper.closeUI("HuaZhuangStartView");
        //@ts-ignore
        this.closeSelf();
    };

    photoFinish(){
        this.photoDoneAni.node.active = true;
        this.photoDoneAni.play();
        let num = Math.floor(Math.random() * (99 - 80) + 80);
        this.lblMateNum.string = num.toString();
        // UIUtils.uiUtils.showNumChange(this.lblMateNum, 0, num, 30);
    };

    onClickDone(){
        // var sectionInfo = DBManager.getOne(dbh.table_midPve, Initializer.playerProxy.userData.mmap);
        // UIHelper.openUI("FightView", null, () => {
        //     Initializer.fightProxy.customsStoryShow(sectionInfo);
        //     this.onClickClose();
        // });
    };

    setVibrate(time: number) {
        // ApiUtils.apiUtils.setVibrate(time);
    };

    sendMakeDot(data) {
        if (!data)
            return;
        // Initializer.huaZhuangProxy.sendMakeDot(data.makeup_close,data.makeup_step);
    };
}
